<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品分类</title>
</head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="jquery-3.2.1.min.js"></script>
<style type="text/css">
    .console {
        width: 100%;
        height: 400px;
        position: relative;
        padding-left: 38px;
    }

    .console_box {
        height: inherit;
        float: left;
        border: rgba(0, 0, 0, 0.49) solid 1px;
    }
    .goods_name_style{
        line-height: 2em;
        font-size: larger;
        width: 100%;
        overflow: paged-y-controls;
        height: 99%;
        font-weight: bold;
    }
    #classify_btn{
        width: 128px;
        height: 64px;
        background-color: #1966ff;
        border: none;
        margin-left: 978px;
        color: white;
        font-size: large;

    }
</style>
<body>
<div class="console">
    <div class="console_box" style="width: 58%">
        <textarea id="goods_name" class="goods_name_style" ></textarea>
    </div>
    <div class="console_box" style="width: 38%">
    <textarea id="output" class="goods_name_style"></textarea>

    </div>
    <button id="classify_btn">分类</button>
</div>
</body>
<script type="text/javascript">
    (function () {
        function bindAction() {
            $('#classify_btn').click(function () {
                sendRequest({
                    param:$('#goods_name').val()
                });
            })
        }
        function sendRequest(goodsNames) {
            $.ajax({
                url:'/classify',
                type:'POST',
                data:goodsNames,
                success:function (data) {
                    var types = '';
                    data.forEach(function (item) {
                        types = types+item+"\n";
                    })
                    $('#output').text(types);
                }
            })
        }
        function init() {
            bindAction();
        }
        return init();
    })()
</script>
</html>